<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form :form="form">

        <a-form-item label=" 状态码" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['statusCode']" placeholder="请输入 状态码"></a-input>
        </a-form-item>
        <a-form-item label=" 订单号" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['orderNo']" placeholder="请输入 订单号"></a-input>
        </a-form-item>
        <a-form-item label="合作方" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['authorizeName']" placeholder="请输入合作方"></a-input>
        </a-form-item>
        <a-form-item label="委案日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['authorizeTime']" placeholder="请输入委案日期"></a-input>
        </a-form-item>
        <a-form-item label="放贷时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['lenderTime']" placeholder="请输入放贷时间"></a-input>
        </a-form-item>
        <a-form-item label="抵押权人" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['mortgagee']" placeholder="请输入抵押权人"></a-input>
        </a-form-item>
        <a-form-item label="客户姓名" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['lenderName']" placeholder="请输入客户姓名"></a-input>
        </a-form-item>
        <a-form-item label="实际贷款额" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['loanMoney']" placeholder="请输入实际贷款额"></a-input>
        </a-form-item>
        <a-form-item label="期数" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['month']" placeholder="请输入期数"></a-input>
        </a-form-item>
        <a-form-item label="放款额" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['payment']" placeholder="请输入放款额"></a-input>
        </a-form-item>
        <a-form-item label="月供金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['monthMoney']" placeholder="请输入月供金额"></a-input>
        </a-form-item>
        <a-form-item label="已还期数" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['repaidMonth']" placeholder="请输入已还期数"></a-input>
        </a-form-item>
        <a-form-item label="逾期期数" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['overdueMonth']" placeholder="请输入逾期期数"></a-input>
        </a-form-item>
        <a-form-item label="逾期金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['overdueMoney']" placeholder="请输入逾期金额"></a-input>
        </a-form-item>
        <a-form-item label="已代偿金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['compensatoryMoney']" placeholder="请输入已代偿金额"></a-input>
        </a-form-item>
        <a-form-item label="贷款余额" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['loanBalance']" placeholder="请输入贷款余额"></a-input>
        </a-form-item>
        <a-form-item label="车型" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['carType']" placeholder="请输入车型"></a-input>
        </a-form-item>
        <a-form-item label="颜色" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['carColor']" placeholder="请输入颜色"></a-input>
        </a-form-item>
        <a-form-item label="车牌号" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['carNumber']" placeholder="请输入车牌号"></a-input>
        </a-form-item>
        <a-form-item label="车架号" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['frameNumber']" placeholder="请输入车架号"></a-input>
        </a-form-item>
        <a-form-item label="是否有钥匙" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['hasKey']" placeholder="请输入是否有钥匙"></a-input>
        </a-form-item>
        <a-form-item label="GPS状态(在线/离线)" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['gpsStatus']" placeholder="请输入GPS状态(在线/离线)"></a-input>
        </a-form-item>
        <a-form-item label="GPS 所在城市" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['gpsCity']" placeholder="请输入GPS 所在城市"></a-input>
        </a-form-item>
        <a-form-item label="GPS平台" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['gpsBrand']" placeholder="请输入GPS平台"></a-input>
        </a-form-item>
        <a-form-item label="GPS信号回传时间及电量" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['gpsTimeElectricity']" placeholder="请输入GPS信号回传时间及电量"></a-input>
        </a-form-item>
        <a-form-item label="GPS显示地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['gpsLocation']" placeholder="请输入GPS显示地址"></a-input>
        </a-form-item>
        <a-form-item label="出发前和甲方核对还款情况" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['lastConfirm']" placeholder="请输入出发前和甲方核对还款情况"></a-input>
        </a-form-item>
        <a-form-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['remark']" placeholder="请输入备注"></a-input>
        </a-form-item>
        <a-form-item label="借款人身份证" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['lenderIdno']" placeholder="请输入借款人身份证"></a-input>
        </a-form-item>
        <a-form-item label="借款人电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['lenderMobile']" placeholder="请输入借款人电话"></a-input>
        </a-form-item>
        <a-form-item label="居住地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['lenderHome']" placeholder="请输入居住地址"></a-input>
        </a-form-item>
        <a-form-item label="单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['lenderOffice']" placeholder="请输入单位地址"></a-input>
        </a-form-item>
        <a-form-item label="配偶姓名" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['partnerName']" placeholder="请输入配偶姓名"></a-input>
        </a-form-item>
        <a-form-item label="配偶单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['partnerOffice']" placeholder="请输入配偶单位地址"></a-input>
        </a-form-item>
        <a-form-item label="联系人姓名" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['contactName']" placeholder="请输入联系人姓名"></a-input>
        </a-form-item>
        <a-form-item label="与主贷人关系" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['contactRelation']" placeholder="请输入与主贷人关系"></a-input>
        </a-form-item>
        <a-form-item label="联系人电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['contactMobile']" placeholder="请输入联系人电话"></a-input>
        </a-form-item>
        <a-form-item label="主贷人是否有其他联系方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['hasOtherContact']" placeholder="请输入主贷人是否有其他联系方式"></a-input>
        </a-form-item>
        <a-form-item label="备注（其他情况说明）" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-decorator="['otherRemark']" placeholder="请输入备注（其他情况说明）"></a-input>
        </a-form-item>

      </a-form>
    </a-spin>
  </j-modal>
</template>

<script>

  import { httpAction } from '@/api/manage'
  import pick from 'lodash.pick'
  import { validateDuplicateValue } from '@/utils/util'


  export default {
    name: "OrderModal",
    components: { 
    },
    data () {
      return {
        form: this.$form.createForm(this),
        title:"操作",
        width:800,
        visible: false,
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        validatorRules: {
        },
        url: {
          add: "/afterloan/order/add",
          edit: "/afterloan/order/edit",
        }
      }
    },
    created () {
    },
    methods: {
      add () {
        this.edit({});
      },
      edit (record) {
        this.form.resetFields();
        this.model = Object.assign({}, record);
        this.visible = true;
        this.$nextTick(() => {
          this.form.setFieldsValue(pick(this.model,'statusCode','orderNo','authorizeName','authorizeTime','lenderTime','mortgagee','lenderName','loanMoney','month','payment','monthMoney','repaidMonth','overdueMonth','overdueMoney','compensatoryMoney','loanBalance','carType','carColor','carNumber','frameNumber','hasKey','gpsStatus','gpsCity','gpsBrand','gpsTimeElectricity','gpsLocation','lastConfirm','remark','lenderIdno','lenderMobile','lenderHome','lenderOffice','partnerName','partnerOffice','contactName','contactRelation','contactMobile','hasOtherContact','otherRemark'))
        })
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        const that = this;
        // 触发表单验证
        this.form.validateFields((err, values) => {
          if (!err) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            let formData = Object.assign(this.model, values);
            console.log("表单提交数据",formData)
            httpAction(httpurl,formData,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
              that.close();
            })
          }
         
        })
      },
      handleCancel () {
        this.close()
      },
      popupCallback(row){
        this.form.setFieldsValue(pick(row,'statusCode','orderNo','authorizeName','authorizeTime','lenderTime','mortgagee','lenderName','loanMoney','month','payment','monthMoney','repaidMonth','overdueMonth','overdueMoney','compensatoryMoney','loanBalance','carType','carColor','carNumber','frameNumber','hasKey','gpsStatus','gpsCity','gpsBrand','gpsTimeElectricity','gpsLocation','lastConfirm','remark','lenderIdno','lenderMobile','lenderHome','lenderOffice','partnerName','partnerOffice','contactName','contactRelation','contactMobile','hasOtherContact','otherRemark'))
      },

      
    }
  }
</script>